<template>
  <div class="answers_users">

    <div class="my_organisation" v-for="dept in answersData.data" :key="dept.orgUUID">
      <div class="my_organisation_right">
        <div style="margin-left:10px;margin-right:10px;">
          <div class="party-org-content">
            <span class="red-line"></span>
            <span style="font-size:15px; font-weight: bold;">{{ dept.orgShortName }}</span>
          </div>
          <div class="party-dept-item">
            <van-row style="font-size: 13px; width: 100%; display: flex">
              <van-col span="8">换届时间：</van-col>
              <van-col span="16">
                <template v-if="dept.orgChangeTime">{{ formatDate(dept.orgChangeTime) }}</template>
                <template v-else>-</template>
              </van-col>
            </van-row>
          </div>

          <div class="party-dept-item">
            <van-row style="font-size: 13px; width: 100%; display: flex">
              <van-col span="8">所属单位：</van-col>
              <van-col span="16">
                <template v-if="dept.workOrganization">{{ dept.workOrganization }}</template>
                <template v-else>-</template>
              </van-col>
            </van-row>
          </div>

          <div class="party-dept-item">
            <van-row style="font-size: 13px; width: 100%; display: flex">
              <van-col span="8">{{ dept.orgSj }}：</van-col>
              <van-col span="16">
                <template v-if="dept.dwsj">
                  <span style="font-size:0">
                        <span @click="showUser(dept.dwsj, null,15)"
                              style="color: black; font-size: 13px;">
                          {{ dept.dwsj }}
                        </span>
                  </span>
                </template>
                <template v-else>-</template>
              </van-col>
            </van-row>
          </div>

          <div class="party-dept-item">
            <van-row style="font-size: 13px; width: 100%; display: flex">
              <van-col span="8">{{ partyOrgLeaderTitle(dept.orgDw) }}</van-col>
              <van-col span="16" >
                  <span v-for="(leader, index) in dept.orgLeader" :key="index">
                    <span v-if="index != 0">、</span>
                    <span style="font-size:0">
                      <span @click="showUser(leader.displayName, leader.ygId,15)"
                            style="color: black; font-size: 13px;">
                        {{ leader.displayName }}
                      </span>
                    </span>
                  </span>
              </van-col>
            </van-row>
          </div>

          <template v-if="dept?.branchBrandList?.length > 0">
            <div class="party-dept-item">
              <van-row style="font-size: 13px; width: 100%; display: flex">
                <van-col span="8">支部品牌：</van-col>
                <van-col span="16">
                  <div style="width: 60%; flex-grow:1  ">
                    <span v-for="(branchBrand, index) in dept.branchBrandList" :key="index">
                      <span v-if="index != 0">、</span>
                      {{ branchBrand }}
                    </span>
                  </div>
                </van-col>
              </van-row>
            </div>
          </template>

          <template v-if="dept?.pioneerPostUsers?.length > 0">
            <div class="party-dept-item">
              <van-row style="font-size: 13px; width: 100%; display: flex">
                <van-col span="8">所辖先锋岗：</van-col>
                <van-col span="16">
                    <span v-for="(user, index) in dept.pioneerPostUsers" :key="index">
                      <span v-if="index != 0">、</span>
                      {{ user.displayName }}
                    </span>
                </van-col>
              </van-row>
            </div>
          </template>

          <template v-if="dept?.dutyList?.length > 0">
            <div class="party-dept-item">
              <van-row style="font-size: 13px; width: 100%; display: flex">
                <van-col span="8">所属责任区：</van-col>
                <van-col span="16">
                    <span v-for="(dupt, index) in dept.dutyList" :key="index">
                      <span v-if="index != 0">、</span>
                      {{ dupt.typeName }}
                    </span>
                </van-col>
              </van-row>
            </div>
          </template>

          <template v-if="dept?.commandosList?.length > 0">
            <div class="party-dept-item">
              <van-row style="font-size: 13px; width: 100%; display: flex">
                <van-col span="8">所辖突击队：</van-col>
                <van-col span="16">
                    <span v-for="(commandos, index) in dept.commandosList" :key="index">
                      <span v-if="index != 0">、</span>
                      {{ commandos.typeName }}
                    </span>
                </van-col>
              </van-row>
            </div>
          </template>

        </div>
      </div>
    </div>
  </div>
</template>


<script>
import {charPattern, chinaShow, isPartTimeShow} from '@/common/util'
import {setQueryUsers} from "@/utils/setChatStoreData";

export default {
  name: 'AnswersQueryDepts',
  props: ['answersData'],
  methods: {
    showUser(userName, ygId, size) {
      setQueryUsers(this, userName, ygId, size);
    },
    formatDate(data) {
      return data.split(" ")[0];
    },
    charConversion(text) {
      return charPattern(text);
    },
    chinaConversion(text) {
      return chinaShow(text);
    },
    isPartTimeConversion(text) {
      return isPartTimeShow(text);
    },
    partyOrgLeaderTitle(orgDw) {
      const showName = orgDw || '领导名单';
      return `${showName}：`;
    },

  }
}
</script>
<style>
.party-org-content {
  border-radius: 10px;
  padding: 5px 10px 0 0;
  margin-bottom: 10px;
}

.party-dept-item {
  width: 100%;
  padding: 5px 0;
}

.party-org-content .red-line {
  display: inline-block;
  width: 4px;
  height: 12px;
  background: #ff0000;
  margin-right: 6px;
  margin-top: 10px;
  border-radius: 5px;
}

</style>
